<%--
  Created by IntelliJ IDEA.
  User: Specter
  Date: 2019/5/5
  Time: 13:03
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>注册界面</title>

    <!-- Site Properties -->
    <link rel="stylesheet" type="text/css" th:href="@{/webjars/Semantic-UI/2.3.3/semantic.min.css}" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.3.3/semantic.css">
    <link rel="stylesheet" th:href="@{/css/login.css}" href="/css/login.css">
</head>

<body>
<div class="ui middle aligned center aligned grid">
    <div class="column">
        <h2 class="ui image header" style="color: white">
            绿色生活——用户注册界面
        </h2>
        <div class="ui segment circle-0 mb-0" style="opacity: 0.8">
            <div class="ui tab account active" data-tab="account">
                <form action="message.jsp" class="ui large form" method="get" name="form1" onsubmit="return check()">
                    <div class="ui stacked">
                        <div class="field">
                            <div class="ui left icon input">
                                <i class="user circle outline icon"></i>
                                <input class="circle-0" type="text" name="surname" placeholder="姓">
                            </div>
                        </div>
                        <div class="field">
                            <div class="ui left icon input">
                                <i class="user circle outline icon"></i>
                                <input class="circle-0" type="text" name="name" placeholder="名" autofocus>
                            </div>
                        </div>
                        <div class="field">
                            <div class="ui left icon input">
                                <i class="mail icon"></i>
                                <input class="circle-0" type="text" name="mail" placeholder="邮箱" autofocus>
                            </div>
                        </div>
                        <div class="field">
                            <div class="ui left icon input">
                                <i class="lock icon"></i>
                                <input class="circle-0" type="password" name="password" placeholder="密码">
                            </div>
                        </div>
                        <div class="field">
                            <div class="ui left icon input">
                                <i class="lock icon"></i>
                                <input class="circle-0" type="password" name="agpassword" placeholder="确认密码">
                            </div>
                        </div>
                        <div class="flex-between" style="margin-bottom: 1rem;">
                            <a href="anlogin.jsp" class="forget-pass" style="color: blue" >已注册，立即登录</a>
                        </div>
                        <input class="ui fluid large teal submit button circle-0" id="sub" type="submit" value="立即注册">

                    </div>

                </form>
            </div>

        </div>

    </div>
</div>
<script>
    function check()
    {
        if (form1.surname.value=='')
        {
            alert("请填写姓！");
            form1.surname.focus();
            return false;
        }
        else if (form1.name.value=='')
        {
            alert("请填写名！");
            form1.name.focus();
            return false;
        }
        else if (form1.mail.value=='')
        {
            alert("请填写邮箱！");
            form1.mail.focus();
            return false;
        }
        else if (form1.password.value=='')
        {
            alert("请填写密码！");
            form1.password.focus();
            return false;
        }
        else if (form1.password.value!=form1.agpassword.value)
        {
            alert("两次填写的密码不一致！");
            form1.agpassword.focus();
            return false;
        }
        return true;
    }
</script>
<script th:src="@{/webjars/jquery/3.3.1/jquery.min.js}" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script th:src="@{/webjars/Semantic-UI/2.3.3/components/tab.min.js}" src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.3.3/components/tab.min.js"></script>
<script th:src="@{/webjars/Semantic-UI/2.3.3/components/form.min.js}" src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.3.3/components/form.min.js"></script>
<script th:src="@{/webjars/Semantic-UI/2.3.3/components/checkbox.min.js}" src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.3.3/components/checkbox.min.js"></script>
<script th:src="@{/webjars/Semantic-UI/2.3.3/components/transition.min.js}" src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.3.3/components/transition.min.js"></script>

</body>

</html>
